﻿function TabPage(container)
{
    this.Container = container;
    this.Items = [];
    this.m_ActiveTab = null; 
}

TabPage.IE = (navigator.appName=="Microsoft Internet Explorer") && (parseInt(navigator.appVersion) >= 4);

TabPage.prototype.Add = function(tab)
{
	tab.sID = this.Items.length;
	tab.Parent = this;
    this.Items.push(tab);
};

TabPage.prototype.Render = function()
{
    var doc = document;
    var ul = doc.createElement("UL");
    ul.id = "Tab";
    ul.onmouseover = MV;
    ul.onmouseout = MO;
    for( var i=0; i<this.Items.length; ++i )
    {
        ul.appendChild(this.Items[i].Render(doc));
    }
    
    return ul;
};

TabPage.prototype.Show = function()
{
    this.Container.appendChild(this.Render());
};

function Tab(id, text, isActive, eventHandler)
{
    this.Text = text;
    this.ID = id;
    this.ClientEvent = eventHandler;
    this.IsActive = isActive;
    this.m_Element = null;
    this.Parent = null; 
}

Tab.prototype.Render = function(doc)
{
    var li = doc.createElement("LI");
    this.m_Element = li;
    li.Object = this;

    var img = doc.createElement("A");
    li.appendChild(img);    
    li.img = img;
    img.innerHTML = this.Text;
    img.style.display = 'block';
    img.style.padding = "5px 8px 5px 8px";
    if( this.sID == 0 )
    {
    	li.style.marginLeft = "15px";
    }
    if( this.IsActive )
    {
        li.id = "ActiveTab";
        this.Parent.m_ActiveTab = this;
	img.style.background = "url('/images/Tooltip/ActiveRight.gif') no-repeat top right";
    }
    else
    {
        li.id = "InActiveTab";
	img.style.background = "url('/images/Tooltip/inActiveRight.gif') no-repeat top right";
    }

    
    li.onclick = function()
    {
        this.Object.SetActive();
        
        if( this.Object.ClientEvent )
        {
        	this.Object.ClientEvent(this.Object);
        }
    };
    
    return li;
};

Tab.prototype.SetActive = function()
{
	if( this.m_Element.id != this.Parent.m_ActiveTab.m_Element.id )
	{
	    this.IsActive = true;
	    this.m_Element.id = "ActiveTab";
	    this.m_Element.img.style.background = "url('/images/Tooltip/ActiveRight.gif') no-repeat top right";  			    this.m_Element.style.color = "#000";
	    this.Parent.m_ActiveTab.IsActive = false;
	    this.Parent.m_ActiveTab.m_Element.id = "InActiveTab";
	    this.Parent.m_ActiveTab.m_Element.img.style.background = "url('/images/Tooltip/inActiveRight.gif') no-repeat top right";
	    this.Parent.m_ActiveTab.m_Element.style.color = "#000";
	    this.Parent.m_ActiveTab = this;
    }
};

Tab.StrLen = function( sTargetStr ) 
{
    var sTmpStr, sTmpChar; 
    var nOriginLen = 0; 
    var nStrLength = 0; 
    sTmpStr = new String(sTargetStr); 
    nOriginLen = sTmpStr.length; 
    for ( var i=0 ; i < nOriginLen ; i++ ) 
    {
        sTmpChar = sTmpStr.charAt(i); 
        if (escape(sTmpChar).length > 4) 
        { 
            nStrLength += 2; 
        } 
        else if (sTmpChar!='\r') 
        { 
            nStrLength ++; 
        } 
    } 
    
    return nStrLength;
};

function MV(evt)
{
    if( !evt )
    {
        evt = window.event;
    }
    var e  = evt.target;
    if( !e )
    {
        e = evt.srcElement;
    }
    if( e.id == "InActiveTab" )
    {
        with(e.style)
        {
            color = "#F30";
        } 
    }   
}

function MO(evt)
{
    if( !evt )
    {
        evt = window.event;
    }
    var e  = evt.target;
    if( !e )
    {
        e = evt.srcElement;
    }    
    if( e.id == "InActiveTab" )
    {
        with(e.style)
        {
        	color = "#000";
        } 
    }    
}